<html lang="zh-CN">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="./img/icon.png">

    <title>Fixed Top Navbar Example for Bootstrap</title>

    <!-- Bootstrap core CSS -->
    <link href="./css/bootstrap.min.css" rel="stylesheet">
	<style type="text/css">
        .show-grid [class ^="col-"] {
            padding-top: 10px;
            padding-bottom: 10px;
            background-color: #eee;
            border: 1px solid #ddd;
            background-color: rgba(86, 61, 124, .15);
            border: 1px solid rgba(86, 61, 124, .2);
        }
        </style>
</head>
<body>
	<div class="container-fluid">
		<?php
		for ($i = 0; $i < 5; $i++){
		?>
		<div class="row show-grid">
			<div class="col-md-4">
				<div style="height: 60px; width: 100px; padding-top: 5px; padding-bottom: 5px;">
					<img src="./img/userbiglogo.jpg" style="height:40px; width:50px;"/>
				</div>
			</div>
			<div class="col-md-4">
				<div style="height: 60px; width: 100px; padding-top: 5px; padding-bottom: 5px;">
					.col-md-4
				</div>
			</div>
			<div class="col-md-4">
				<div class="pull-right" style="height: 60px; width: 100px; padding-top: 13px; padding-bottom: 13px;">
					<a class="btn btn-default" href="#" role="button">Link</a>
				</div>
			</div>
		</div>
		<?php
		}
		?>
	</div>
	<div class="container-fluid">
		<div class="table-responsive">
			<table class="table table-bordered table-striped">
				<thead>
					<tr>
						<th></th>
						<th>
							超小屏幕
							<small>手机 (&lt;768px)</small>
						</th>
						<th>
							小屏幕
							<small>平板 (≥768px)</small>
						</th>
						<th>
							中等屏幕
							<small>桌面显示器 (≥992px)</small>
						</th>
						<th>
							大屏幕
							<small>大桌面显示器 (≥1200px)</small>
						</th>
					</tr>
				</thead>
				<tbody>
					<tr>
						<th class="text-nowrap" scope="row">栅格系统行为</th>
						<td>总是水平排列</td>
						<td colspan="3">开始是堆叠在一起的，当大于这些阈值时将变为水平排列C</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row"><code>.container</code> 最大宽度</th>
						<td>None （自动）</td>
						<td>750px</td>
						<td>970px</td>
						<td>1170px</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">类前缀</th>
						<td><code>.col-xs-</code></td>
						<td><code>.col-sm-</code></td>
						<td><code>.col-md-</code></td>
						<td><code>.col-lg-</code></td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">列（column）数</th>
						<td colspan="4">12</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">最大列（column）宽</th>
						<td class="text-muted">自动</td>
						<td>~62px</td>
						<td>~81px</td>
						<td>~97px</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">槽（gutter）宽</th>
						<td colspan="4">30px （每列左右均有 15px）</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">可嵌套</th>
						<td colspan="4">是</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">偏移（Offsets）</th>
						<td colspan="4">是</td>
					</tr>
					<tr>
						<th class="text-nowrap" scope="row">列排序</th>
						<td colspan="4">是</td>
					</tr>
				</tbody>
			</table>
		</div>
	</div>
</body>
</html>